クライアントサイドウェブ開発ツールを理解する

クライアントサイドのツールは敷居が高いかもしれませんが、この一連の記事は、最も一般的なクライアントサイドツールの型の目的を示し、一緒に連携できるツールを説明し、パッケージマネージャーを使用してそれらをインストールする方法を説明し、コマンドラインを使用してそれらを制御することを目的としています。最後に、生産的になる方法を示す完全なツールチェーンの例を提供することで完了します。

前提条件

ここで紹介しているツールを使う前に、まずはコアの HTML、CSS、JavaScript の基礎を学習しておくことをお勧めします。また、端末/コマンドラインの使用にも慣れておいてください。

ガイド

クライアントサイドツールの概要: この記事では、最新のウェブツールの概要、どのような種類のツールがあるのか、どこでウェブアプリ開発のライフサイクルを見つけるのか、そして個々のツールのヘルプを見つける方法について説明します。
パッケージ管理の基本: この記事では、プロジェクトツールの依存関係をインストールしたり、最新の状態に保つなど、自分のプロジェクトでどのようにパッケージマネージャを使用できるかを理解するために、パッケージマネージャーについて詳しく説明していきます。
ツールチェーンの紹介: このシリーズの最後の数記事では、サンプルケーススタディツールチェーンを構築するプロセスを紹介することで、ツールの知識を固めます。理にかなった開発環境を設定し、その場所に変換ツールを置くところから、実際にアプリを展開するところまで、すべて説明します。この記事では、ケーススタディを紹介し、開発者ツールを設定し、コード変換ツールを設定します。
アプリのデプロイ: シリーズの最終回では、前回の記事で構築したツールチェーンの例を使い、サンプルアプリをデプロイできるようにしていきます。コードを GitHub にプッシュし、 GitHub pages にデプロイし、簡単なテストを組み込む方法も紹介します。